<script setup lang='ts'>
import { ElCard } from 'element-plus'

import List from './list.vue'
import Review from './review.vue'

defineOptions({
    // eslint-disable-next-line vue/component-definition-name-casing
    name: '/operations-pages/product-center/product-list',
})

const activeName = ref('first')
const componentDom = computed(() => {
    return activeName.value === 'first' ? List : Review
})
</script>

<template>
    <ElCard shadow="never">
        <el-tabs v-model="activeName">
            <el-tab-pane label="产品列表"
                         name="first"
            >
                <el-tab-pane label="产品审核"
                             name="second"
                />
            </el-tab-pane>
        </el-tabs>

        <component :is="componentDom" />
    </ElCard>
</template>
